<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh-CN">
<head>
    <title th:text="登录"></title>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="icon" href="https://raw.githubusercontent.com/xzMhehe/StaticFile_CDN/main/static/mo/media_home_page.png">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="keywords" content="WAP游戏,文字游戏,怀旧,mud">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telphone=no,email=no">
    <meta name="misapplication-tap-highlight" content="no">
    <meta name="screen-orientation" content="portrait">
    <meta name="x5-orientation" content="portrait">
    <link rel="stylesheet" type="text/css" th:href="@{/assets/css/style.css}" />
    <script th:src="@{/assets/js/flexible.js}" type="text/javascript" ></script>
    <script th:src="@{/assets/js/zepto.min.js}"  type="text/javascript" ></script>
</head>
<body>
<!--头像-->
<div class="head">
    <div class="img">
        <img th:src="@{/assets/picture/head.png}">
    </div>
    <p>WAP游戏登录</p>
</div>
<!--登陆-->
<form method="post" th:action="@{login}" id="form">
    <div class="item">
        <input type="text" name="name" placeholder="请输入您的帐号" autocomplete="off" class="name">
    </div>

    <div class="item">
        <input type="password" name="password" placeholder="请输入您的密码" autocomplete="off" class="password">
    </div>
    <a href="register" style="font-size: 10px;float: right;">没有账户？点击注册</a>
    <div class="submit"><button>登&nbsp;录</button></div>
    <div th:if="${error != null && error.message != null}">
        <div style="color: red;font-size: 10px;float: right;" th:text="${error.message }"></div>
    </div>
</form>
<!--第三方登陆-->
<!--<div class="other-login">
    <p><span>使用第三方帐号登陆</span></p>
    <div class="third">
        <ul>
            <li><img src="static/picture/icon-qq.png"></li>
            <li><img src="static/picture/icon-weixin.png"></li>
            <li><img src="static/picture/icon-weibo.png"></li>
        </ul>
    </div>
</div>-->
<!--尾部
<div class="footer">
    <img src="static/picture/logo.png">
    <p>登录使用就表示同意用户协议<a href="javascript:;">条款</a>和<a href="javascript:;">隐私</a>政策</p>
</div>-->
</body>
</html>
<script type="text/javascript">
    // 提交验证
    $('.submit button').click(function(){
        var name = $('input[name=name]').val();
        var password = $('input[name=password]').val();
        if(!/^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(name)){
            alert("请先输入正确帐号")
            return
        }
        if($.trim(name)==''){
            alert("请输入帐号")
            $('input[name=name]').focus()
            return false
        }
        if($.trim(password)==''){
            alert("请输入密码")
            $('input[name=password]').focus()
            return false
        }
        $("#form").submit;

    })
</script>